<template>
    <div class="renameDir">
                <label for="validationTextarea">
                {{ this.$store.getters.getRenameOption.type == 1 ? '重名命文章': '重命名子目录' }}    
                </label>
        <!-- 子目录标题 -->
        <div class="input-group "
            
        >
            <div class="input-group-prepend">
                <span class="input-group-text">目录名</span>
            </div>
            <input type="text" 
            v-model="subData.title"
            name="目录名"
            v-validate="{ 
            required: true , 
            'illegalchar': true ,
            'max': 20
            }"
            maxlength="21"
            :class="{'is-invalid': errors.first('目录名') }"
            class="form-control rounded-right" >
            <div class="invalid-feedback">
                {{ errors.first("目录名") }}
            </div>
        </div>
        <!-- 子目录备注 -->
        <div v-if="this.$store.getters.getRenameOption.type != 1" class="mb-3 mt-3">
            
            <textarea class="form-control " 
            id="validationTextarea" 
            v-model="subData.common"
            name="子目录备注信息"
            v-validate="{ 
            required: true , 
            'illegalchar': true ,
            'max': 100
            }"
            maxlength="101"
            :class="{'is-invalid': errors.first('子目录备注信息')}"
            placeholder="子目录备注信息" ></textarea>
            <div class="invalid-feedback">
                {{ errors.first("子目录备注信息") }}
            </div>
        </div>
        <div class="d-flex justify-content-center align-items-center  bd-highlight mksubDir-opr">
            <button type="button" class="btn btn-secondary m-2"
            @click="close()"
            >取消</button>
            <button type="button" class="btn btn-primary m-2"
            @click="defenceClick"
            >重命名</button>  
        </div>    
    </div>
</template>

<script>
import { reNameDir } from "../../../../api/interface/filesystem.js";
import { freshToken } from "../../../../api/interface/token.js";
import { tools } from "../../../../api/tools.js";

export default {
    data(){
        return {
            subData:{
                title:"",
                common:""
            },
            prepareItem: null
        };
    },
    inject:["noteAgent"],
    methods:{
        close(){
            this.resetData();
            let note = this.noteAgent();
            note.popup.rename_innerDir = false;
        },
        reName(){
            let that = this;
            let renameObj = this.$store.getters.getRenameOption;
            
            let reqObj = {};
            if( renameObj.top_id ){
                reqObj.top_id = renameObj.top_id;
                reqObj.content = {};
                reqObj.content.title = this.subData.title;
                reqObj.content.common = this.subData.common;
            }
            if( renameObj.inner_id ){
                reqObj.inner_id = renameObj.inner_id;
                reqObj.content = {};
                reqObj.content.title = this.subData.title;
                reqObj.content.common = this.subData.common;
            }
            if( renameObj.art_id ){
                reqObj.art_id = renameObj.art_id;
                 reqObj.content = {};
                reqObj.content.title = this.subData.title;
            }
            
            reNameDir(reqObj).then( renameRes =>{
                
                if( renameRes.data.code == 0 ){
                    this.refetchCurrentTopDirData();
                    this.close();
                }
            } ).catch( err=>{
                this.$httpError.checkResStatus(err.data,function(){
                    
                    //重新请求生成token
                    freshToken().then(res=>{
                        
                        localStorage.setItem("token", res.data.data.token);
                        that.reName();
                    })
                },that);
            } );
        },
        resetData(){
            this.subData.title = "";
            this.subData.common = "";
        },
        //重新获取子目录内容
        refetchCurrentTopDirData(){
            let note = this.noteAgent();
            let target = this.$store.getters.getEndOfPathOfNotebookItem;
            note.$refs.exploreFile.fatchData(target);
        },
        //防抖控制提交代码
        defenceClick: tools.debounceWithTrigger_events(function(){
            
            this.validateRenameDirOrFile();
        }, 2000 , true ),
        //校验层设计
        validateRenameDirOrFile(){
            this.$validator.validate().then(result => {
                if (!result) {
                    // if (this.errors.has('目录名')) {
                        
                    //     return
                    // } 
                    // if (this.errors.has('子目录备注')) {
                        
                    //     return
                    // } 
                } else {
                    this.reName();   // 验证通过后请求接口的方法
                }
            });
        }
    },
    beforeMount() {
        // let targetType = this.$store.getters.getRenameOption;
        // console.log("重命名对象：", targetType);
    },
    mounted() {
        this.prepareItem = this.$store.getters.getRenameOption;
        this.subData.title = this.prepareItem.title;
        this.subData.common = this.prepareItem.common;
    },
}
</script>

<style lang="scss">

.renameDir{
    display: inline-block;
    margin: 1.5em;
}
</style>